<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>爱上米思齐（MixIO）</title>
    <link rel="shortcut icon" href="img/shortcut.png"/>
    <link href="css/all.css" rel="stylesheet">
    <link rel="preload" href="fonts/fontawesome-webfont.ttf" as="font" type="font/woff" crossorigin="anonymous">
    <script src="js/jquery.min.js"></script>
    <script src="js/lang.js?v=5"></script>
    <script src="js/tools.js?v=10"></script>
    <script src="js/login.js?v=22"></script>
    <script src="<%=configs["BAIDU_STAT_LINK"]%>"></script>
</head>

<body id="body" class="bg-gradient-light" style="height:100vh">
    <style>
        .translate{
            width:50px;
            padding: 0;
            margin-left:5px;
        }
    </style>
    <div style="position:fixed;right:10px;top:10px;display:flex;align-items:center;justify-content:center">
        <i class="fa fa-globe" style="color:#4e73df;margin-right:5px;font-size:2rem"></i>
        <button class="translate btn btn-secondary" id="zh">简</button>
        <button class="translate btn btn-secondary" id="tw">繁</button>
        <button class="translate btn btn-secondary" id="en">EN</button>
    </div>
    <div style="height:calc(100vh - 40px);display:flex;align-items:center;justify-content:center">
    <div class="container" style="opacity: 0.9;margin-top:20px">
        <!-- Outer Row -->
        <div class="row justify-content-center">

            <div class="col-xl-10 col-lg-12 col-md-9">

                <div id="cd" class="card o-hidden border-0 shadow-lg my-5" style="margin-top:0!important">
                    <div class="card-body p-0">
                        <!-- Nested Row within Card Body -->
                        <div class="row">
                            <div class="d-md-none" style="display: flex;width:100%;align-items: center;justify-content: center;margin-top:25px;margin-bottom:-0.5rem">
                                <img src="img/shortcut.png" style="width:40px" alt="">
                                <span style="font-size:30px;font-weight:bold;color:#4e73df;margin-left:10px">MixIO</span>
                            </div>
                            <div id="lg_img" class="col-lg-6 d-none d-lg-block bg-login-image" style="margin-right:-0.375rem"></div>
                            <div class="col-lg-6">
                                <div class="p-5">
                                    <div style="margin-left:-1rem;margin-right:-1rem;margin-top:-1.5rem;display:flex;margin-bottom:1.5rem;justify-content:center">
                                            <a class="btn btn-lg btn-primary btn-circle" style="border:solid #d1d3e2 1px;margin-right:.5rem" id="switch1" onclick="mixioLogin()">
                                                <i class="fa fa-user-o"></i>
                                            </a>
                                            <a class="btn btn-lg btn-light btn-circle" style="border:solid #d1d3e2 1px;margin-left:.5rem;margin-right:.5rem" id="switch2" onclick="mixlyLogin()">
                                                <i class="fa fa-key"></i>
                                            </a>
                                            <a class="btn btn-lg btn-light btn-circle" style="border:solid #d1d3e2 1px;margin-left:.5rem" id="switch3" onclick="projLogin()">
                                                <i class="fa fa-cube"></i>
                                            </a>
                                    </div>
                                    <form class="user" id="form_login" method="post">
                                        <div class="form-group">
                                            <input type="email" class="form-control form-control-user lang" key="EMAIL"
                                                 aria-describedby="emailHelp" name="userName" style="min-width:0;text-align:center;"
                                                placeholder="请输入电子邮箱地址">
                                        </div>
                                        <div class="form-group" id="ref1">
                                            <input type="password" name="password" class="form-control form-control-user lang" key="PASSWORD" style="min-width:0;text-align:center;"
                                                 placeholder="请输入密码">
                                        </div>
                                        <div style="display:flex;align-items: center;justify-content: center;">
                                            <button type="submit" class="btn btn-primary btn-icon-split"><span class="icon"><i class="fa fa-arrow-right" style="margin-top:5px;width:1rem;height:1rem"></i></span><span class="text lang" key="LOGIN" style="margin-top:1px">登录MixIO</span></button>
                                        </div>
                                        
                                    </form>
                                    <form class="user" id="form_login_2" method="post" hidden>
                                        <div class="form-group">
                                            <input class="form-control form-control-user lang" key="MIXLYKEY"
                                                 aria-describedby="emailHelp" name="userName" style="min-width:0;text-align:center;"
                                                placeholder="请输入Mixly Key">
                                        </div>
                                        <div style="display:flex;align-items: center;justify-content: center;">
                                            <button type="submit" class="btn btn-primary btn-icon-split"><span class="icon"><i class="fa fa-arrow-right" style="margin-top:5px;width:1rem;height:1rem"></i></span><span class="text lang" style="margin-top:1px" key="LOGIN2">登录MixIO</span></button>
                                        </div>
                                        
                                    </form>
                                    <div class="user" id="form_login_3" hidden>
                                        <div class="form-group">
                                            <input class="form-control form-control-user lang" key="VFCODE"
                                                 aria-describedby="emailHelp" id="vfCode" name="vfCode" style="min-width:0;text-align:center;font-size: .8rem;border-radius: 10rem;padding: 1.5rem 1rem;"
                                                placeholder="请输入项目授权码">
                                        </div>
                                        <div style="display:flex;align-items: center;justify-content: center;">
                                            <button id="submit3" onclick="guestLogin()" class="btn btn-primary btn-icon-split"><span class="icon"><i class="fa fa-arrow-right" style="margin-top:5px;width:1rem;height:1rem"></i></span><span class="text lang" style="margin-top:1px" key="BROWSE">访问MixIO项目</span></button>
                                        </div>
                                        
                                    </div>
                                    <hr>
                                    <div style="display:flex;flex-wrap:wrap;align-items:center;justify-content:center;margin-bottom:-1.5rem">
                                        <div class="text-center" style="margin-bottom:10px;padding-left: 5px;padding-right: 5px;" id="reset_text">
                                            <a class="btn btn-light btn-icon-split" href="forgot"><span class="icon"><i class="fa fa-refresh" style="margin-top:5px;width:1rem;height:1rem"></i></span><span class="text lang" style="margin-top:1px" key="RESET">重置密码</span></a>
                                        </div>
                                        <div class="text-center" style="margin-bottom:10px;padding-left: 5px;padding-right: 5px;" id="register_text">
                                            <a class="btn btn-light btn-icon-split" href="register" ><span class="icon"><i class="fa fa-flag" style="margin-top:5px;width:1rem;height:1rem"></i></span><span class="text lang" style="margin-top:1px" key="SIGNUP">注册账号</span></a>
                                        </div>
                                        <div class="text-center" style="margin-bottom:10px;padding-left: 5px;padding-right: 5px;" id="documentation_text">
                                            <a class="btn btn-light btn-icon-split" href="https://blog.csdn.net/fengydongdong/article/details/136017627?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522170697370916800182197281%2522%252C%2522scm%2522%253A%252220140713.130102334.pc%255Fall.%2522%257D&request_id=170697370916800182197281&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2~all~first_rank_ecpm_v1~rank_v31_ecpm-1-136017627-null-null.142^v99^pc_search_result_base3&utm_term=MixIO%E8%AF%A6%E7%BB%86%E6%95%99%E7%A8%8BMixly%E5%9B%BE%E5%BD%A2%E5%8C%96%E7%BC%96%E7%A8%8B%E9%BD%90%E6%8A%A4%E6%9C%BA%E5%99%A8%E4%BA%BAArduino%E4%B8%8EMicropython%20%E7%89%A9%E8%81%94%E7%BD%91%E5%B9%B3%E5%8F%B0&spm=1018.2226.3001.4187"><span class="icon"><i class="fa fa-compass" style="margin-top:5px;width:1rem;height:1rem"></i></span><span class="text lang" style="margin-top:1px" key="GUIDE">入门指南</span></a>
                                        </div>
                                        <div class="text-center" style="margin-bottom:10px;padding-left: 5px;padding-right: 5px;" id="question_text">
                                            <a class="btn btn-light btn-icon-split" target="_blank" href="https://gitee.com/mixly2/mixio"><span class="icon"><i class="fa fa-github" style="margin-top:5px;width:1rem;height:1rem"></i></span><span class="text" style="margin-top:1px">开源仓库</span></a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>

        </div>
        

    </div>
    </div>
    <footer id="footer" style="height:40px;font-size:0.8rem;text-align:center">

        <% if (mixly) { %>
            <a href="/mixly">Mixly Lite</a>&nbsp;
        <% } %>
        <% if (mixai) { %>
            <a href="/mixai">MixAI Lite</a>&nbsp;
        <% } %>
        <%-footer%>
        <a href="https://gitee.com/mixly2/mixio" class="lang" key="OPENSRC"></a>&nbsp;
        <a id="admin" class="lang" key="ADMINDASH"></a>
        &nbsp;MixIO © Mixly Team
    </footer>
    <!-- Bootstrap core JavaScript-->
</body>

</html>